Component({
  options: {
    addGlobalClass: true,
  },
  properties: {
    // 定义 target 属性，类型为 Number，默认值为 26
    target: {
      type: Number,
      value: 0,
      observer: function(newVal, oldVal) {
        // 当 target 发生变化时触发
        this.setData({
          target: newVal
        });
      }
    }
  },
  data: {
    blocks: Array.from({ length: 50 }),
    counter: 0,
    target: 0, // 设置目标值
    startAnimation: false,
  },

  lifetimes: {
    attached() {
      // 组件初始化时开始动画
      setTimeout(() => {
        this.numberCounter()
      }, 280)
      
    }
  },

  methods: {
    startAnimationByManual() {
      this.setData({
        counter: 0,
        startAnimation: false
      })
      this.numberCounter();
    },

    numberCounter() {
      if (this.data.counter < this.data.target) {
        const newCounter = this.data.counter + 1;
        const shouldStop = newCounter === this.data.target; // 达到目标后停止

        if(newCounter === 1) {
          this.setData({
            startAnimation: true
          });
        }
        this.setData({
          counter: newCounter,
        });

        if (!shouldStop) {
          setTimeout(() => {
            this.numberCounter();
          }, 31.8);
        } else {
          this.setData({
            startAnimation: false
          });
        }
      }
    }
  }
});